<%@page import="com.framework.entity.Global"%>
<%@ page import="com.biz.utils.ConfigUtil" %>
<%@ page contentType="text/html; charset=UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
    String resoursUrl = ConfigUtil.get("RESOURCES_URL");
%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html class="no-js">
<head>
    <meta charset="UTF-8">
    <title>查看评价</title>
    <jsp:include page="/jsp/inc_head.jsp"></jsp:include>
    <script type="text/javascript" src="<%=resoursUrl%>resources/assets/raty/jquery.raty.js"></script>
    <link rel="stylesheet" href="<%=resoursUrl%>resources/assets/raty/jquery.raty.css" type="text/css">
    <style>
        .pjstar img {
            width: 19px;
        }
        .plpicshowlie > li img {
            height: 70px;
            width: 100%;
        }
        .plpicshowlie > li {
             float: left;
             margin: 1%;
             width: 23%;
         }
    </style>
</head>
<body style="padding-bottom:60px;">
<input type="hidden" id="goodsId" value="${goodsId}"/>
<input type="hidden" id="orderDetailId" value="${orderDetailId}"/>


<input type="hidden" id="form_scoreid" />
<input type="hidden" id="iszhuiping"/>

<div class="am-u-sm-12 am-text-center am-pad-none" style="margin:30px 0 8px;">
    <img src="<%=resoursUrl%>resources/assets/images/icon_dppj1.png" height="45"/>

    <div class="am-u-sm-12 am-pad-none corcolor" style="margin-top:5px;">
        评论
    </div>
</div>

<div class="am-g">

    <!-- 打分项 -->
    <div id="projectHtml"></div>

    <div class="am-u-sm-12 commentlie">
        <div class="am-u-sm-4">
            首次评价:
        </div>
        <div class="am-u-sm-8 am-pad-none">
            <span id="select_text_one"><span  style="color:#ccc;">未评价</span></span>
        </div>
    </div>
    <div class="am-u-sm-12" style="border-bottom:1px solid #dedede;">
        <div id="PicHtml"></div>
        <div class="am-u-sm-12 am-text-right">
            <span id="score_time"></span>
        </div>
    </div>

    <!-- 评论文字 -->
    <div id="textinfoHtml"></div>

    <div class="am-u-sm-12 pltextarea" id="showzhuiping">
        <div class="am-u-sm-3">
            追评:
        </div>
        <div class="am-u-sm-9 am-pad-none">
            <textarea maxlength="300" id="form_txt" placeholder="商品是否满意呢？说说您对我们的看法吧(可输入300字)"></textarea>
        </div>
    </div>


</div>
<c:if test="${self == true}">
<div class="am-u-sm-12 am-text-center am-pad-none plfixedbtm" style="max-width: inherit;">
    <a href="javascript:;" onclick="self.location=document.referrer;">
        <div class="am-u-sm-6 am-pad-none plbtmbtn1">
            返回
        </div>
    </a>
    <a href="javascript:;" onClick="zhuiping()" id="tozhuiping">
        <div class="am-u-sm-6 am-pad-none plbtmbtn3">
            追评
        </div>
    </a>

    <a href="javascript:;" id="thiszhuiping" onclick="savezhuiping()">
        <div class="am-u-sm-6 am-pad-none plbtmbtn3">
            提交
        </div>
    </a>
</div>
</c:if>

<div class="zzc"></div>
<!--网络连接失败弹框-->
<div class="am-u-sm-12 am-pad-none tanchuconf">
    <div class="am-u-sm-12 am-text-center am-pad-none" style="margin:25px 0;">
        <img id="msgimg" src="<%=resoursUrl%>resources/assets/images/getno.png" style="margin:-3px 10px 0 0;" width="30"/>
        <span id="tc_msg"></span>
    </div>
    <div class="am-u-sm-12 am-text-center am-pad-none popbtmbtn">
        <div class="am-u-sm-12 am-pad-none popbtmbtn3" onClick="closepop();">确定</div>
        <%--<div class="am-u-sm-12 am-pad-none popbtmbtn2"  onclick="self.location=document.referrer;">确定</div>--%>
    </div>
</div>




<!--大图弹出div-->
<div class="am-modal am-modal-alert" style="left:0;width:100%;margin-left:0;" tabindex="-1" id="doc-modal-1">
    <!--<a href="javascript:;" class="" style="position:absolute;right:-8px;top:-8px;" data-am-modal-close>
        <img src="<%=basePath%>resources/assets/images/tksb.png" width="25">
    </a>-->
    <div class="am-modal-dialog" style="position:relative; width: 90%;">
        <img src="" id="djdt" width="100%" height="auto" />

        <div style="position:absolute;right:0;top:0;">
            <span class="am-modal-btn"><img src="<%=resoursUrl%>resources/assets/images/delpic.png" width="25"></span>
        </div>
    </div>
</div>

<script>


    $(document).ready(function () {
        Orderdf();

        $("#tozhuiping").show();
        $("#thiszhuiping").hide();
        $("#showzhuiping").hide();

    });


    //打分项模块
    function Orderdf() {
        var goodsId = $("#goodsId").val();
        var orderDetailId = $("#orderDetailId").val();

        var html = '';
        $.ajax({ //这里使用到Jquery的ajax方法
            type: "POST",
            dataType: "json",
            url: '<%=basePath%>/score/queryScore.do',
            data: {goodsId: goodsId, orderDetailId: orderDetailId},
            success: function (data) {
                //评价主表
                var isdateScore = data.isdateScore;
                var queryscore = data.queryscore;
                //打分项目
                var isdateDetail = data.isdateDetail;
                var queryPscoreDetail = data.queryPscoreDetail;//list
                //文字
                var isdateText = data.isdateText;
                var queryscoreText = data.queryscoreText;//list
                //图片
                var isdatePics = data.isdatePics;
                var querypicsList = data.querypicsList;//list

                //打分项目_拼接
                if (isdateDetail == '1') {
                    $.each(queryPscoreDetail, function (i, n) {
                        var tmphtml = '';
                        var min_p = parseInt(this.min_number);
                        var max_p = parseInt(this.max_number);
                        var width_p = max_p * 24;

                        tmphtml += '<div class="am-u-sm-12 am-pad-none commentlie">'
                        + '<div class="am-u-sm-4" style="margin-top:4px;">'
                        + this.score_name
                        + '</div>'
                        + '<div class="am-u-sm-8 am-pad-none" id="xzw_starBox' + this.id + '">'
                        + '<div  id="' + this.id + '">'
                        + '<div class="current-rating" id="showb' + this.id + '"></div>'
                        + '</div>'
                        + '</div>';

                        html += tmphtml;

                    });

                    $("#projectHtml").html(html);

                    $.each(queryPscoreDetail, function (i, n) {
                        $("#" + this.id).raty({
                            number: this.max_number,
                            path: '<%=resoursUrl%>resources/assets/raty/images/',
                            starOff: 'star-off.png',
                            starOn: 'star-on.png',
                            score: this.score,
                            readOnly: true
                        });
                    });

                }


                //主表信息_拼接
                if (isdateScore == '1') {
                    $("#score_time").html(newYYYYMMDD(queryscore.create_time));//评价时间
                    $("#form_scoreid").val(queryscore.id);
                }


                //文字内容_拼接
                if (isdateText == '1') {
                    var textHtml = '';
                    textHtml += '<div class="am-u-sm-12 am-pad-none" style="border-bottom:1px solid #dedede;">';
                    $.each(queryscoreText, function (i, n) {
                        var isadditional_pd = this.isadditional;//0初始评论 1追加评论
                        var role_pd = this.role;//1：客户发表，2：客服回复
                        if (isadditional_pd == '0' && role_pd == '1') {
                            if(!(this.info==null || this.info==''))
                            {
                                //首评
                                $("#select_text_one").html(this.info);
                            }
                        }
                        else if (isadditional_pd == '1' && role_pd == '1')//客户追评
                        {
                            textcount += 1;
                            textHtml += '<div class="am-u-sm-12 commentlie">' +
                            ' <div class="am-u-sm-4">追评:</div>' +
                            '<div class="am-u-sm-8 am-pad-none" style="word-break:break-all">' +
                            this.info +
                            ' </div>' +
                            '<div class="am-u-sm-12 am-text-right" style="color:#727272;">' +
                            newYYYYMMDD(this.create_time) +
                            '</div></div>';
                        }
                        else if (role_pd == '2')//客服回复
                        {
                            textHtml += '<div class="am-u-sm-12 commentlie" style="color:#e73267;">' +
                            '<div class="am-u-sm-4">客服回复:</div>' +
                            '<div class="am-u-sm-8 am-pad-none">' +
                            this.info +
                            '</div>' +
                            '<div class="am-u-sm-12 am-text-right" style="color:#e73267;">' +
                            this.create_time +
                            '</div></div>';

                        }
                        else //错误情况
                        {
                            textHtml += '<div class="am-u-sm-12 commentlie">' +
                            '<div class="am-u-sm-4"></div>' +
                            '<div class="am-u-sm-8 am-pad-none">' +
                            this.info +
                            '</div>' +
                            '<div class="am-u-sm-12 am-text-right" style="color:#727272;">' +
                            this.create_time +
                            '</div></div>';

                        }


                    });

                    textHtml += '</div>';

                    $("#textinfoHtml").html(textHtml);


                }


                //图片_拼接
                if (isdatePics == '1') {
                    var pichtmlpj = '';
                    pichtmlpj += '<ul class="am-u-sm-12 am-pad-none plpicshowlie">';
                    $.each(querypicsList, function (i, n) {
                        pichtmlpj += ' <li class=""><div onclick="djdtOpen(\'<%=Global.OSSURL%>'+this.path+'\');"><img src="<%=Global.OSSURL%>'+ this.path + '"/></li></div>';
                    });
                    pichtmlpj += '</ul>';


                    $("#PicHtml").html(pichtmlpj);
                }

            }
        });
    }
    ;

    var textcount = 0;//追评了几次s
    function zhuiping() {
        var orderId = $("#orderId").val();
        var orderDetailId = $("#orderDetailId").val();

        //if (textcount<4) {
            $("#tozhuiping").hide();
            $("#thiszhuiping").show();
            $("#showzhuiping").show();
        $('html,body').animate({ scrollTop: $(document).height() }, 1000);
            //window.location.href = "${pageContext.request.contextPath}/score/client_toZhuiPing.do?orderId=" + orderId + "&orderDetailId=" + orderDetailId + "&isbook=" + isbook;
        //}
        //else
        //{
        //    $(".tanchuconf,.zzc").show();
        //    $("#tc_msg").html("达到追评上限");
        //}

    }

//保存追评
    function savezhuiping() {
        var scoreid = $("#form_scoreid").val();
        var info = $("#form_txt").val();
        if (scoreid == null || scoreid == '' || scoreid == 'null') {
            $(".tanchuconf,.zzc").show();
            $("#tc_msg").html("保存失败");
            return;
        }
        if (info == null || info == '' || info == 'null') {
            $(".tanchuconf,.zzc").show();
            $("#tc_msg").html("请填写内容");
            return;
        }

        $.ajax({ //这里使用到Jquery的ajax方法
            type: "POST",
            dataType: "json",
            url: '<%=basePath%>/score/saveScoreChase.do',
            data: {info: info, scoreid: scoreid},
            success: function (data) {
                var msg = data.msg;
                var text = data.text;
                if (msg == '1') {
                    //成功
                    //window.location.href = "${pageContext.request.contextPath}/myOrder/toMyOrderByState.do?flag=0";
                }
                else {
                    //失败
                    $(".tanchuconf,.zzc").show();
                    $("#tc_msg").html(text);
                }
            }
        });
    }

    //打开关闭弹框
    function closepop() {
        $(".tanchuconf,.zzc").hide();


    }

    function newYYYYMMDD(dateStr) {
        var tmp = dateStr;
        if (dateStr.length > 19) {
            tmp = dateStr.substr(0, 19);

        }
        return tmp;
    }

    function djdtOpen(url)
    {
        $("#djdt").attr("src",url);
        $("#doc-modal-1").modal('open');
    }

    

</script>
</body>
</html>
